/**
 * Created by Ysssssss on 2021/4/26.
 */

import React, { useState, useRef, useEffect } from 'react'
import {Input} from "antd";

const ParamsInput = props => {
    const { value, onChange, alwaysChange, autoFocus, staticContext, ..._props } = props
    const [hackValue, setHackValue] = useState(null)
    const inputRef = useRef()

    const handleFocus = () => {
        setHackValue(value)
    }

    const handleChange = e => {
        setHackValue(e.currentTarget.value)
    }

    const handleHackValueSubmit = () => {
        (hackValue !== value || alwaysChange) && onChange(hackValue)
    }

    const handleBlur = () => {
        handleHackValueSubmit()
        setHackValue(null)
    }

    useEffect(() => {
        autoFocus && inputRef.current?.focus()
    }, [])

    return (
        <Input
            value={hackValue === null ? value : hackValue}
            onFocus={handleFocus}
            onChange={handleChange}
            onPressEnter={handleHackValueSubmit}
            onBlur={handleBlur}
            ref={inputRef}
            {..._props}
        />
    )
}

export default ParamsInput